'use client'
require('dotenv').config()
import {useEffect, useState} from 'react';
import Header from "@/app/components/Header/Header";
import axios from "axios";
import {usePathname} from "next/navigation";
import TourPage from "@/app/components/TourPage/TourPage";

export default function Page() {
    const baseUrl = process.env.BASE_URL
    const path = usePathname()
    const pathParts = path.split('/')
    const id = pathParts[pathParts.length - 1]
    const [tour_data, set_tour_data] = useState<any[]>([])
    const get_tour = async () => {
        try {
            const response = await axios.get(
                `${baseUrl}/api/tour/${id}`, {
                    headers: {
                        Authorization: "Bearer your_permanent_token"
                    }
                })
            return await response.data
        } catch (e) {
            console.error(e)
        }
    }
    useEffect(() => {
        get_tour().then((data) => set_tour_data(data))
    })
    return (
        <div>
            <Header/>
            {
                <TourPage
                    id={tour_data["id"]}
                    name={tour_data["name"]}
                    description={tour_data["description"]}
                    price={tour_data["price"]}
                    src={tour_data["photo"]}
                />
            }
        </div>
    );
}
